<template>
  <form >
    <div class="form-group">
      <label class="sr-only" for="userAccount"></label>
      <div class="input-group">
        <div class="input-group-addon">您的账户</div>
        <input type="text" class="form-control" id="userAccount"
               v-model="userAccount"
               placeholder="请输入您的帐号">
      </div>
    </div>
    <div class="form-group">
      <label class="sr-only" for="userPassword"></label>
      <div class="input-group">
        <div class="input-group-addon">您的密码</div>
        <input type="text" class="form-control" id="userPassword" v-model="userPassword" placeholder="请输入您的密码">
      </div>
    </div>

    <div class="form-group">
      <label class="sr-only" for="reUserPassword"></label>
      <div class="input-group">
        <div class="input-group-addon">验证密码</div>
        <input type="text" class="form-control" id="reUserPassword" v-model="reUserPassword" placeholder="请输入您的密码">
      </div>
    </div>
    <div class="form-group">
      <label class="sr-only" for="userName"></label>
      <div class="input-group">
        <div class="input-group-addon">您的昵称</div>
        <input type="text" class="form-control" id="userName" v-model="userName" placeholder="请输入您的姓名">
      </div>
    </div>
    <div class="form-group">
      <label class="sr-only" for="userEmail"></label>
      <div class="input-group">
        <div class="input-group-addon">您的邮箱</div>
        <input type="text" class="form-control" id="userEmail" v-model="userEmail" placeholder="请输入您的邮箱">
      </div>
    </div>
    <div class="form-group">
      <label class="sr-only" for="userSignature"></label>
      <div class="input-group">
        <div class="input-group-addon">您的签名</div>
        <input type="text" class="form-control" id="userSignature" v-model="userSignature"
               placeholder="请输入您的口头禅">
      </div>
    </div>

    <router-link to="/" class="btn btn-default">返回</router-link>
    <button type="button" @click="registerSubmit" class="btn btn-success ">注册</button>

  </form>
</template>

<script>
  import loginService from '@/service/loginService';
  export default {
    name: 'register',
    data () {
      return {
        userAccount: '',
        userPassword: '',
        reUserPassword: '',
        userName: '',
        userEmail: '',
        userSignature: ''
      }
    },
    methods: {
      async registerSubmit(){
      	let params=this.valideFormData();
        let res = await  loginService.userRegister( params );
        console.log(res);
      },
      valideFormData(){
      	return{
          userAccount: this.userAccount,
          userPassword: this.userPassword,
          userName: this.userName,
          userEmail: this.userEmail,
          userSignature: this.userSignature
        }
      }
    }
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
</style>
